Skip to content

fix: improve conditions for missed payload case#1648

Merged
danielroe merged 23 commits intonpmx-dev:mainfrom
alexdln:chore/flickers-on-specific-case
Feb 25, 2026
Merged

fix: improve conditions for missed payload case#1648
danielroe merged 23 commits intonpmx-dev:mainfrom
alexdln:chore/flickers-on-specific-case

Conversation

@alexdln
Copy link
Member

@alexdln alexdln commented Feb 25, 2026

🧭 Context

We have a rare scenario where the user receives HTML, but when they subsequently make a request for the payload, the payload is in the prerender state and a fallback value is returned. After XXX, this behavior is handled well, but there was a chance the user would receive an empty payload, resulting in flickering during page rendering

📚 Description

On the client, we need to wait not only for hydration to complete, but also for the data loaded on the server [before sending response] to be received. Configured for the main data (pkg and readme) - the rest are non-critical (and usually loaded faster then this two) and it feels fast this way.

There's also a case where the payload exists, but the status is marked as idle or pending, which also caused flickering. Updated the conditions to check the data availability, not the status

@vercel
Copy link

vercel bot commented Feb 25, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
npmx.dev Ready Ready Preview, Comment Feb 25, 2026 8:53pm
2 Skipped Deployments
Project Deployment Actions Updated (UTC)
docs.npmx.dev Ignored Ignored Preview Feb 25, 2026 8:53pm
npmx-lunaria Ignored Ignored Feb 25, 2026 8:53pm

Request Review

@codecov
Copy link

codecov bot commented Feb 25, 2026

Codecov Report

❌ Patch coverage is 0% with 7 lines in your changes missing coverage. Please review.
✅ All tests successful. No failed tests found.

Files with missing lines Patch % Lines
app/pages/package/[[org]]/[name].vue 0.00% 5 Missing and 2 partials ⚠️

📢 Thoughts on this report? Let us know!

@alexdln alexdln changed the title chore: check initial data on package page fix: improve conditions for missed payload case Feb 25, 2026
@alexdln alexdln marked this pull request as ready for review February 25, 2026 21:01
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Feb 25, 2026

📝 Walkthrough

Walkthrough

This pull request modifies package page hydration and server-rendering logic whilst extending the readme type definition. The changes introduce a hasServerContentOnly flag to track server-rendered content availability, refactor conditions determining when to display the skeleton and article components, and update the hydration logic to better distinguish between SPA fallback and server-content-only states. The ReadmeResponse type is extended with an optional defaultValue boolean property, which is also propagated through the component logic.

Possibly related PRs

Suggested reviewers

  • danielroe
🚥 Pre-merge checks | ✅ 1
✅ Passed checks (1 passed)
Check name Status Explanation
Description check ✅ Passed The pull request description clearly relates to the changeset, explaining the specific problem (empty payload causing flickering) and the solution (waiting for hydration and server data before rendering).

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2


ℹ️ Review info

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 40d1964 and fbefb1c.

📒 Files selected for processing (2)
  • app/pages/package/[[org]]/[name].vue
  • shared/types/readme.ts

@danielroe danielroe added this pull request to the merge queue Feb 25, 2026
Merged via the queue into npmx-dev:main with commit e61657e Feb 25, 2026
19 checks passed
@alexdln alexdln deleted the chore/flickers-on-specific-case branch February 25, 2026 21:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants